<template>
  <section class="component lwasuit-follow-trial">
    <el-form label-width="90px" :model="model" :rules="rules" ref="form">
      <el-row>
        <el-col :span="12">
          <el-form-item label="法院" prop="lawsuit">
            <el-input v-model="model.lawsuit" :disabled="isView"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="法官" prop="judge">
            <el-input v-model="model.judge" :disabled="isView"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="法官电话" prop="judgePhone">
            <el-input v-model="model.judgePhone" :disabled="isView"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="庭审时间" prop="lawerDealTime">
            <el-date-picker v-model="model.lawerDealTime" type="datetime" placeholder="选择日期时间" clearable :disabled="isView">
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="庭审结果" prop="lawerCheckResult">
            <el-radio-group v-model="model.lawerCheckResult" :disabled="isView">
              <el-radio v-for="{index,name,code} in $dict.getDictData('LawerCheckResult')" :key="index" :label="code">{{name}}</el-radio>
            </el-radio-group>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item :label="this.model.lawerCheckResult === 'DOWN' ? '判决时间' : '调解时间' " prop="lawerCheckTime">
            <el-date-picker v-model="model.lawerCheckTime" type="datetime" placeholder="选择日期时间" clearable :disabled="isView">
            </el-date-picker>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="12">
          <el-form-item label="更新人" prop="updateRealName">
            <el-input v-model="model.updateRealName" disabled></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="跟进人" prop="operatorRealName">
            <el-input v-model="model.operatorRealName" disabled></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-form-item label="备注" prop="recordRemark">
        <el-input type="textarea" v-model="model.recordRemark" :maxlength="500" :disabled="isView" show-word-limit></el-input>
      </el-form-item>
      <el-form-item label="附件" prop="fileIds">
        <file-upload v-model="model.fileIds" :fileList.sync="fileList" :disabled="isView"></file-upload>
      </el-form-item>
    </el-form>
  </section>
</template>

<script lang="ts">
import Vue from "vue";
import Component from "vue-class-component";
import { Dependencies } from "~/core/decorator";
import { State } from "vuex-class";
import { Emit, Prop, Watch } from "vue-property-decorator";
import FileUpload from "~/components/common/file-upload.vue";
import { FileUploadService } from "~/services/file-service/file-upload.service";

@Component({
  components: {
    FileUpload
  }
})
export default class LawsuitFollowTrial extends Vue {
  @Dependencies(FileUploadService)
  private fileUploadService: FileUploadService
  @Prop({default: false})
  private isView
  @Prop()
  private follower
  @State
  private userData

  private fileList: any[] = []

  private initModel: any = {
    lawsuit: '',
    judge: '',
    judgePhone: '',
    lawerDealTime: '',
    lawerCheckTime: '',
    lawerCheckResult: '',
    updateRealName: '',
    operatorRealName: '',
    recordRemark: '',
  }

  private model: any = {...this.initModel}

  private rules: any = {
    lawsuit: [{ required: true, message: "请输入法院", trigger: "blur" }],
    judge: [{ required: true, message: "请输入法官", trigger: "blur" }],
    judgePhone: [{ required: true, message: "请输入法官电话", trigger: "blur" }],
    lawerDealTime: [{ required: true, message: "请选择庭审时间", trigger: "blur" }],
    lawerCheckTime: [{ required: true, message: "请选择庭审时间", trigger: "blur" }],
    lawerCheckResult: [{ required: true, message: "请选择庭审结果", trigger: "blur" }],
    recordRemark: [{ required: true, message: "请输入备注", trigger: "blur" }],
  }

  
  public revertData(data){
     this.model.lawsuit = data.lawsuit
      this.model.judge = data.judge
      this.model.judgePhone = data.judgePhone
      this.model.lawerDealTime = data.lawerDealTime
      this.model.lawerCheckTime = data.lawerCheckTime
      this.model.lawerCheckResult = data.lawerCheckResult
      this.model.updateRealName = this.userData.realName
      this.model.recordRemark = data.recordRemark
      this.model.operatorRealName = this.follower
      this.callbackFileList(data.recordFileIds)
  }

public reset(){
    const form: any = this.$refs['form']
    form.resetFields()
    this.fileList = []
    this.model.operatorRealName = this.follower
    this.model.updateRealName = this.userData.realName
  }

  private async getData() {
    const form: any = this.$refs['form']
    const result =  await form.validate().then(resolve => {
      const tepmFileIds = this.fileList.length === 0 ? "" : this.fileList.map(v => v.response.id).join(",")
      return {...this.model, recordFileIds: tepmFileIds}
    }).catch(rejected => {
      return false
    })
    return result
  }


  private callbackFileList(fileIds: string) {
    if (!fileIds) return 
    this.fileUploadService.getAllUploadFileByIds(fileIds).subscribe(
      data => {
        if (!data || data.length === 0) return
        this.fileList = data.map(v => {
          return {name: v.originalName, response: {id: v.id}}
        })
      }
    )
  }

}
</script>

<style lang="less" scoped>
</style>